<template>
  <div class="my_rank">
      <div>
          <a-table  bordered :dataSource="aaxxcc" :columns="columns" :rowKey="(record, index) => index" :pagination="false">
            <template slot="sort" slot-scope="text, record">{{record.ranking}}</template>
            <template slot="userName" slot-scope="text, record">{{record.nickname}}</template>
            <template slot="area" slot-scope="text, record">{{record.department_name}}</template>
            <template slot="rank" slot-scope="text, record">{{record.integral}}</template>
          </a-table>
        <div class="qeee" style="text-align:center;margin-top:20px">
              <a-pagination v-model="current" size="small" :pageSize="pageSize" @change="currentpage" showQuickJumper  :total="total" show-less-items />
          </div>
      </div>
  </div>
</template>

<script>
import {getmyrankData} from '../../api/usercenter'
export default {
    data() {
        return {
            columns: [
              { title: "排名", scopedSlots: { customRender: "sort" }, width: 80,align: 'center',},
              {
                title: "姓名",
                scopedSlots: { customRender: "userName" },
                align: 'center',
              },
              {
                title: "部门",
                scopedSlots: { customRender: "area" },
                align: 'center',
              },
              {
                title: "积分",
                scopedSlots: { customRender: "rank" },
                align: 'center',
              },
            ],
            current:1,
            pageSize:8,
            total:0,
            aaxxcc:[]
        };
    },
    methods:{
        currentpage(val){
            this.current = val
            this.zxcasdqwe()
        },
        zxcasdqwe(){
            let page = this.current
            let page_size = this.pageSize
            getmyrankData(page,page_size).then(res=>{
                this.aaxxcc = res.results
                this.total = res.count
            })
        }
    },
    created(){
        this.zxcasdqwe()
    }
}
</script>

<style lang='less'> 
</style>